<template>
    <div class="mui-content">
      <div>
        <div class="collectWrapper" v-if="list.IsCollect" @click="changeCollect(list)">取消：<span class="star3"></span></div>
        <div class="collectWrapper" v-if="!list.IsCollect" @click="changeCollect(list)">收藏：<span class="star4"></span></div>
      </div>
      <transition name="fade2">
        <Confirm
          :titleConfirm=titleConfirm
          :msgConfirm=msgConfirm
          v-on:sure="sure($event)"
          v-on:giveUp="giveUp($event)"
          v-if="isCofirm"
        >
        </Confirm>
      </transition>
    </div>
</template>

<script>
  import  Confirm from '@components/common/Confirm.vue'
    export default {
        name: "colletcResource.vue",
      data(){
          return{
            collectIndex:[],
            UserId:'',
            isResource:true,
            regist:false,
            titleConfirm:'',
            msgConfirm:'',
            isCofirm:false,
          }
      },
      props:{
          list:[],
      },
      components:{
        Confirm
      },
      created(){
      },
      methods:{
        changeCollect(collect){
          let me=this;
          me.IsCollect= !collect.IsCollect;
          this.collectIndex=collect;
          this.$Global.zcServer.Post({
            IsNeedLogin: 'true',
            Paras:{
              UserId:me.$Global.UserId ,
              Name:'Vue_CourseResource',
              action:"Ext_ResourceStoreIsCollect",
              Data:{
                IsCollect:me.IsCollect,
                SN: collect.SN,
                TS:collect.TS
              }
            },
            Callback:me.cb_collect,
            Scope:me,
          });
        },
        cb_collect(resJson,scope){
          let me=this
          console.log('收藏',resJson);
          if(resJson.success==true){
            // me.isCollect=!me.isCollect;
            me.collectIndex.IsCollect=!me.collectIndex.IsCollect
            if(!me.IsCollect){
              me.collectRemind='取消收藏成功！';
            }else {
              me.collectRemind='收藏成功！';
            }
            me.remind=1;
            setTimeout(function () {
              me.remind=0;
            },1500);
          }else {
            this.isCofirm=true;
            this.titleConfirm='提醒'
            if(resJson.msg.indexOf("PleaseRegistry">=0)){
              this.msgConfirm='请注册并登陆后再收藏！'
            }

          }
          // console.log('收藏',scope);
        },
      }
    }
</script>

<style scoped>

  .mui-content .content .rightContent .text .collectWrapper{
    overflow: hidden;
    float: right;
  }
  .mui-content .content .rightContent .text .collectWrapper *{
    display: inline-block;
  }
  .collectWrapper .star3{
    display: inline-block;
    width: 16px;
    height: 15px;
    background-size: 16px 15px;
    background-image: url('../../assets/img/shouCang2.png');
  }
  .collectWrapper .star4{
    display: inline-block;
    width: 16px;
    height: 15px;
    background-size: 16px 15px;
    background-image: url('../../assets/img/shouCang.png');
  }
</style>
